import React from "react";
import './user_manage.scss'
import {Button, Input, Select} from "antd";
import {BrowserRouter, Switch} from "react-router-dom";
import {renderRoutes} from "react-router-config";


function UserManage(props){

    const route = props.route

    const gotoAdd = () => {
        window.location.href = '../user_manage/add?menu=user_manage'
    }

    return(
        <div className={'component_container'}>
            <div className={'component_title'}>
                停车用户管理
            </div>

            <div className={'user-manage-panel'}>

                <div className={'user-manage-panel-item'}>
                    <div className={'user-manage-panel-item-title'}>
                        区域
                    </div>
                    <Select placeholder={'请选择区域'}>
                        <Select.Option>区域一</Select.Option>
                    </Select>
                </div>

                <div className={'user-manage-panel-item'}>
                    <div className={'user-manage-panel-item-title'}>
                        单位名称
                    </div>
                    <Input placeholder={'请输入关键字'}/>
                </div>

                <div className={'user-manage-panel-item'}>
                    <div className={'user-manage-panel-item-title'}>
                        用户名称
                    </div>
                    <Input placeholder={'请输入用户姓名'}/>
                </div>

                <div className={'user-manage-panel-item'}>
                    <div className={'user-manage-panel-item-title'}>
                        用户名
                    </div>
                    <Input placeholder={'请输入用户账号'}/>
                </div>

                <div className={'user-manage-panel-item'}>
                    <div className={'user-manage-panel-item-title'}>
                        角色
                    </div>
                    <Select placeholder={'请选择角色'}>
                        <Select.Option>角色一</Select.Option>
                    </Select>
                </div>

                <div className={'user-manage-panel-item'}>
                    <div className={'user-manage-panel-item-title'}>
                        单位类型
                    </div>
                    <Select placeholder={'请选择单位类型'}>
                        <Select.Option>单位类型一</Select.Option>
                    </Select>
                </div>

                <Button type={'primary'}>查询</Button>
                <Button>重置</Button>
                <Button onClick={gotoAdd} type={'primary'}>新增用户</Button>

            </div>

            <div>
                <BrowserRouter>
                    <Switch>
                        {renderRoutes(route.children)}
                    </Switch>
                </BrowserRouter>
            </div>
        </div>
    )
}

export default UserManage